<template>
  <div class="TheConfig">
    <component v-if="type" :is="type" :widget="currentWidget"></component>
    <div v-else style="font-size:12px; text-align:center; margin-top: 20px;">
      页面配置(todo)
    </div>
  </div>
</template>
<script>
export default {
  name: "TheConfig",
  data() {
    return {
      id: 1,
    }
  },
  computed: {
    currentWidget() {
      return this.$store.state.currentWidget
    },
    type() {
      return (this.currentWidget && this.currentWidget.configType) || ""
    },
  },
  methods: {},
  created() {
    // 新建或者刷新页面被选中 widget 为空
    this.$store.commit("updateCurrentWidget", null)
  },
}
</script>
<style lang="scss">
.TheNav {
  background: #fff;
  box-shadow: 0 1px 7px rgba(0, 0, 0, 0.3);
  justify-content: space-between;
  padding: 0 24px 0 19px;
}
</style>
